<?xml version="1.0" encoding="UTF-8" ?>
<Module>
    <ModulePrefs title="hello world example" >
	<Require feature="dynamic-height"/>
	</ModulePrefs>
    <Content type="html">
        <![CDATA[ 
		<script src="http://code.jquery.com/jquery-latest.js"></script>
        <script language="JavaScript">
			var url_server = "http://hdc1112.appspot.com/";
			var url_login = url_server + "login";
			var url_getnote = url_server + "getNotification?";
			var url_addchat = url_server + "addChat?";
			var url_count = url_server + "count";
			var sessionID;
			
			var area_debug_most= 50;
			var area_debug_current=0;
			
			//count timer! 
			function Refresh_Count() {
				_IG_FetchContent(url_count,
				function(responseText) {
					Update_Count(responseText);
					d1("refresh_count"+":"+responseText);
				},{ refreshInterval: 15 });
			}
			function Update_Count(responseText) {
				$("#div_count").html(responseText);
			}
			
			var count_timer;
			function Stop_Count_Timer() {
				clearInterval(count_timer);
			}
			function Set_Count_Timer() {
				if (typeof count_timer == "number") {
					return;
				}
				count_timer = setInterval("Refresh_Count()", 20000);
			}
			//count timer! //ends
			
			//debug!
			function d1(debug_info) {
				$("#div_debug").html(debug_info);
			}
			function d2(debug_info) {
				d1(debug_info);
				add_area_debug(debug_info);
			}
			function add_area_debug(debug_info) {
				var date = new Date();
				var datestring = date.getHours()+":"+date.getMinutes()+":"+date.getSeconds()+" ";
				$("#area_debug").html($("#area_debug").html()+"\n"+datestring+debug_info);
				//add some code which handles the debug info exceeds area_debug_most mayby substring is used
			}
			//debug! //ends
			
			//start here!
			$(document).ready(function() {
				_IG_AdjustIFrameHeight();
			
				var debug=false;
				if(debug==false) {
					$("#btn_stopcount").css({'display':'none'});
					$("#btn_startcount").css({'display':'none'});
					$("#area_debug").css({'display':'none'});
				} else {
					$("#div_debug").css({'width':'80%'});
				}
				
				d2("start");
				//Set_Count_Timer();
				Login();
			});
			//start here ! //ends
			
			//Login here!
			function Login() {
				enable("btn_login");
				disable("btn_logout");
				disable("area_input");
				disable("area_visual");
				disable("btn_send");
				$("#btn_login").unbind('click').bind('click',function(){
					//request login if suc, goto wait,if failed,stop
					//解决跨域问题。我要用jquery的ajax请求，超时特性			
					disable("btn_login");             
	                //request login if suc, goto wait,if failed,stop
					var timeout = 0;
					var timeout_Timer = setTimeout(function() {
						if (timeout == 1) {
							return;
						}
						timeout = 1;
						d1("/login request timeout");
						enable("btn_login");
						alert('timeout');
					},
					500);
					_IG_FetchContent(url_login,
					function(resposeText) {
						if (timeout == 1) {
							return;
						}
						d1("/login request finished");
						timeout = 1;
						alert('ok!');
					},{ refreshInterval: 0 });
														
				});
			}
			//Login here! //ends
			//utility methods here !
			function disable(id) {
				$("#"+id).attr("disabled",true);
			}
			function enable(id) {
				$("#"+id).removeAttr("disabled"); 
			}
			//utility methods here ! //ends
			//events !

			//events ! //ends
        </script>

<table width="342" height="250" border="1" cellpadding="0" cellspacing="0">
    <tr>
        <td height="15" colspan="3">
            Logo            
              <div id="area_count">
            </div>
      </td>
    </tr>
    <tr>
        <td height="101" colspan="3">
			<textarea id="area_visual"></textarea>
		</td>
    </tr>
    <tr>
        <td width="64" height="45">
            <input type="button" value="Login" id="btn_login"/>
            <input type="button" value="Logout" id="btn_logout" />
      </td>
        <td width="208">
   			<textarea id="area_input"></textarea>
	     </td>
        <td width="62">
            <input type="button" value="Send!" id="btn_send" />
        </td>
    </tr>
    <tr>
        <td height="16" colspan="3">
            &nbsp;
            <div id="div_debug">
            </div>
      </td>
    </tr>
  <tr>
    <td colspan="3">
            <textarea id="area_debug">
            </textarea>
            <br/>
            <input type="button" value="stop count timer" onClick="Stop_Count_Timer()"
            id="btn_stopcount" />
            <input type="button" onClick="Set_Count_Timer()" value="start count timer"
            id="btn_startcount" />
    </td>
    </tr>
</table>

        ]]>
    </Content>
</Module>